<?php

/*
 * Template Name: Single Case Page
 */

get_header();?>

<?php
		/** Build header **/
		if ($page_header_type !== '' && $page_header_type !== 'none') {
			$page_header = new unheader($metabox_data, $post->post_title, $post->post_excerpt);

			$header_html = $page_header->html;
			if ($header_html !== '') {
				echo '<div id="page-header">';
				echo uncode_remove_p_tag( $page_header->html );
				echo '</div>';
			}

			if (!empty($page_header->poster_id) && $page_header->poster_id !== false && $media !== '') {
				$media = $page_header->poster_id;
			}
		}
		echo '<script type="text/javascript">UNCODE.initHeader();</script>';

?>

<div class="row-container case-header">
    <div class="row limit-width row-parent col-double-gutter double-top-padding double-bottom-padding padmbb0">
    <div class="row-inner">
        
        <div class="col-lg-4 pos-bottom cssanimation sequence fadeInBottom">
            <h1 class="case-title-3"><?php the_title(); ?></h1>
            
            <ul class="cl">
            <li><strong><?php _e('Category:'); ?></strong> <?php the_category(''); ?></li>            
            <li><strong><?php _e('Client:'); ?></strong> <?php the_field('case_client'); ?></li>
            <li><strong><?php _e('Industry:'); ?></strong> <?php get_the_term_list( $id, $taxonomy, $before, $sep, $after ); ?></li>            
            <li><strong><?php _e('Year:'); ?></strong> <?php the_field('case_date'); ?></li>            
            </ul>
            
            <div class="case-text">
            <?php the_content(); ?>
            
            <?php if( get_field('case_goal') ): ?>
            <h5><?php _e('Goal'); ?></h5>
            <p><?php the_field('case_goal'); ?></p>
            </div>
            <?php endif; ?>
            
            <?php if( get_field('case_solution') ): ?>
            <h5><?php _e('Solution'); ?></h5>
            <p><?php the_field('case_solution'); ?></p>
            </div>
            <?php endif; ?>

            </div>  
            
            <?php if( get_field('website_link') ): ?>
            <a href="<?php the_field('website_link'); ?>" target="_blank" rel="noopener noreferrer"><button class="btn study-link-2" style="background: <?php the_field('bg_color'); ?>;"><i class="fas fa-long-arrow-alt-right"></i> <?php _e('View project'); ?></button></a>
            <?php endif; ?>
            
        </div>
        
        <div class="col-lg-2 pos-bottom padmbt0">
        <?php if( get_field('case_features') ): ?>
            <div class="cs-meta cssanimation sequence fadeInBottom">
            <h5 class=""><?php _e('Technologies & Features'); ?></h5>
            <ul class="project-features">
                <?php
    
                // check if the repeater field has rows of data
                if( have_rows('case_features') ):
    
                 	// loop through the rows of data
                    while ( have_rows('case_features') ) : the_row(); ?>
                    <li><?php the_sub_field('case_feature'); ?></li>
    
                <?php endwhile;
    
                else :
    
                // no rows found
    
                endif;
    
                ?>
            </ul>    
            </div>   
        <?php endif; ?>
        </div>
        
    </div>
    </div>
</div>

<div class="row-container case-studies-container-2 case-studies-list" style="background-color: #f8f9fb;">
    <div class="row limit-width row-parent double-top-padding double-bottom-padding">
    <div class="row-inner">
        
        <div class="col-lg-12 pos-middle column_parent">
        <div class="center cssanimation sequence fadeInBottom"><img src="<?php the_post_thumbnail_url(); ?>"></div>   
        </div>
        
    </div>
    </div>
</div>
<div class="row-container" style="background-color: #f8f9fb;">
<div class="row limit-width row-parent col-double-gutter double-top-padding double-bottom-padding">
    <div class="row-inner cols-md-responsive">
    </div>
</div>
<div class="custom-shape-divider-bottom-1622649291">
    <svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none">
        <path d="M985.66,92.83C906.67,72,823.78,31,743.84,14.19c-82.26-17.34-168.06-16.33-250.45.39-57.84,11.73-114,31.07-172,41.86A600.21,600.21,0,0,1,0,27.35V120H1200V95.8C1132.19,118.92,1055.71,111.31,985.66,92.83Z" class="shape-fill-1"></path>
    </svg>
</div>
</div>

<div class="row-container">
    <div class="row limit-width row-parent col-double-gutter double-top-padding double-bottom-padding">
    <div class="row-inner cols-md-responsive">
        
        <div class="col-lg-6 col-md-50">
            <img alt="" src="<?php the_post_thumbnail_url(); ?>" loading="lazy">
       </div>        
        
        <div class="col-lg-6 col-md-50 pos-middle padt15">
            <h2 class="service-features-title-3"><?php _e('Lorem ipsum dolor sit amet, consectetur ', 'uncode'); ?></h2>
            <p class="main-text"><?php _e('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent dictum mauris condimentum urna tincidunt varius. Curabitur ornare sit amet nulla vitae sodales. Praesent ex ex, sollicitudin vitae mattis vel, fermentum vitae erat', 'uncode'); ?></p>
       </div>
       
    </div>
    </div>
</div>

<div class="row-container">
    <div class="row limit-width row-parent col-double-gutter double-top-padding double-bottom-padding">
    <div class="row-inner cols-md-responsive">
        
        <div class="col-lg-6 col-md-50 pos-middle padt15">
            <h1 class="service-features-title-3"><?php _e('Lorem ipsum dolor sit amet, consectetur ', 'uncode'); ?></h1>
            <p class="main-text"><?php _e('Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent dictum mauris condimentum urna tincidunt varius. Curabitur ornare sit amet nulla vitae sodales. Praesent ex ex, sollicitudin vitae mattis vel, fermentum vitae erat', 'uncode'); ?></p>
       </div>
       
        <div class="col-lg-6 col-md-50">
            <img alt="" src="<?php the_post_thumbnail_url(); ?>" loading="lazy">
       </div>   
       
    </div>
    </div>
</div>

<div class="row-container">
    <div class="row full-width">
        
    <div class="owl-carousel-wrapper">
	<div class="owl-carousel-container owl-carousel-loading zero-gutter">
	<div id="index-<?php echo uncode_big_rand(); ?>" class="owl-carousel owl-element owl-theme owl-dots-outside owl-height-auto" data-loop="false" data-dots="false" data-nav="true" data-navspeed="1000" data-autoplay="false" data-lg="1" data-md="1" data-sm="1">

        <div class="tmb tmb-light tmb-overlay-anim tmb-no-double-tap tmb-overlay-text-anim tmb-reveal-bottom tmb-iso-w12 tmb-content-under tmb-media-first tmb-iso">
            <div class="t-inside">    
            <div class="center"><a href="<?php the_field('mockup_image'); ?>" data-lity><img src="<?php the_field('mockup_image'); ?>"><a/></div>   
            </div>
        </div>

        </div>        
    </div>
    </div>     

    </div>
</div>

<?php get_template_part( 'templates/related-cases' ); ?>

<div class="row-container quick-cta-container">
    <div class="row limit-width row-parent col-double-gutter double-top-padding double-bottom-padding">

        <div class="isotope-system">
    	<div class="isotope-wrapper half-gutter">
    		<div class="isotope-container isotope-layout style-masonry isotope-pagination" data-type="fit ro" data-layout="fitRows" data-lg="400" data-sm="6">

            <div class="tmb tmb-overlay-anim tmb-no-double-tap tmb-overlay-text-anim tmb-reveal-bottom tmb-shadowed tmb-iso-w6 tmb-content-under tmb-media-first tmb-iso">
                <div class="t-inside">    
                <div class="t-entry-text">
                    <div class="t-entry-text-tc double-block-padding cta-action-box center">  
                        <h4 class="quote-form-box-2-title center"><?php _e('I\'m ready to get<br>started on my website.', 'uncode'); ?></h4>
                        <a class="center" href="<?php echo get_home_url(); ?>/website-questionnaire"><button class="btn btn-main-2"><?php _e('Get a Quote'); ?></button></a>
                    </div>
                </div>
                </div>
            </div>
            
            <div class="tmb tmb-overlay-anim tmb-no-double-tap tmb-overlay-text-anim tmb-reveal-bottom tmb-shadowed tmb-iso-w6 tmb-content-under tmb-media-first tmb-iso">
                <div class="t-inside">    
                <div class="t-entry-text">
                    <div class="t-entry-text-tc double-block-padding cta-action-box center">
                        <h4 class="quote-form-box-2-title center"><?php _e('I\'d like to have a<br>consultation first.', 'uncode'); ?></h4>
                        <a class="center" href="<?php echo get_home_url(); ?>/web-design-consultation/"><button class="btn btn-main-2"><?php _e('Free Consultation'); ?></button></a>
                    </div>
                </div>
                </div>
            </div>
            
            </div>        
        </div>
    </div>

    </div>
</div>

<?php get_footer(); ?>